<template>
  <div class="score_type">
    <div class="score_title">
      <div class="left title-text">具体考核</div>
      <div class="right-box">
        <div class="right" @click="checkStand">评分标准</div>
        <div class="right history" @click="checkHistory" v-if="quarterNow > 0 && showHistory">历史评价</div>
        <div class="right" @click="checkOther" v-if="userList.length > 1">其他人员评分</div>
      </div>
    </div>
    <div
      class="score_table"
      v-if="
        busSign.includes('DEAL_MAIN_LEADER_ASSESS') &&
        busSign !== 'DEAL_MAIN_LEADER_ASSESS_03' &&
        showPage !== 'evalute'
      ">
      <ScoreTable :totalScore="totalScore" :userInfo="userInfoData" v-bind="$attrs"></ScoreTable>
    </div>
    <div class="scroll_box">
      <!-- 指标评价 -->
      <div class="entry_list" v-if="assessMode === 1">
        <ScoreList :scoreList="targetData" :disabled="disabled" ref="indexScore" @scoreSubmit="scoreSubmit"></ScoreList>
      </div>
      <!-- 综合评价 -->
      <div class="assess_sugg" v-else>
        <div class="sugg_title">
          <span class="title-text">考核结果等次</span>
        </div>
        <div class="sugg_choose">
          <div
            class="li"
            :class="{ active_li: activeId == item.id }"
            v-for="item in resultList"
            :key="item.id"
            @click="chooseAssessSugg(item)">
            {{ item.name }}
          </div>
        </div>
        <!-- 选择较差时原因填写 -->
        <div class="instruction" v-if="activeId === '4'">
          <div class="name">备注</div>
          <div class="content">
            <van-field
              v-model="remark"
              rows="2"
              autosize
              type="textarea"
              placeholder="选择较差时需要输入原因"
              :readonly="disabled" />
          </div>
        </div>
      </div>
      <div class="score_extra">
        <div class="extra_title">
          <span class="title-text">承担急难险重任务、处理复杂问题、应对重大考验、防范重大风险的表现</span>
        </div>
        <div class="extra_content">
          <BoardSound :listData="extraData" :entry="!disabled"></BoardSound>
        </div>
      </div>

      <div class="leader_reviews">
        <div class="reviews_title">
          <span class="title-text">领导点评</span>
          <span v-if="activeId == '3'" class="reviews-tips">(等次为“一般”，需要填写说明)</span>
        </div>
        <div class="reviews_content">
          <BoardSound :listData="reviewsaData" :entry="!disabled"></BoardSound>
        </div>
      </div>
    </div>

    <van-dialog v-model="otherShow" title="评分">
      <OtherTable :otherList="otherList" :assessMode="assessMode"></OtherTable>
    </van-dialog>
    <van-dialog v-model="historyShow" title="历史评价" class="history-dialog">
      <history-table :quarterNow="quarterNow" :tableData="tableData" v-if="historyShow"></history-table>
    </van-dialog>

    <ScoringCriteria :criteriaShow="criteriaShow" @close="closeCriteria" />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import BoardSound from '@com/BoardSound'
import ScoreTable from './ScoreTable'
import OtherTable from './OtherTable.vue'
import HistoryTable from './HistoryTable'
import ScoringCriteria from './ScoringCriteria'
import ScoreList from './ScoreList'
import { getUserHistoryAssessData, getAssessTarget } from '@api/api-comment.js'
export default {
  name: 'ScoreType',
  components: {
    BoardSound,
    ScoreTable,
    OtherTable,
    HistoryTable,
    ScoringCriteria,
    ScoreList,
  },
  props: {
    disabled: {
      type: Boolean,
      default: false,
    },
    scoreListDetail: {
      type: Object,
      default: () => {
        return {}
      },
    },
    showPage: {
      type: String,
      default: '',
    },
    busSign: {
      type: String,
      default: '',
    },
    userInfo: {
      type: Object,
      default: () => {
        return {}
      },
    },
    otherList: {
      type: Array,
      default: () => {
        return []
      },
    },
    scoreList: {
      type: Object,
      default: () => {
        return {}
      },
    },
    goodNum: {
      type: Number,
      default: 0,
    },
    quarterNow: Number,
    groupByLeader: Boolean,
    chooseGoodNum: {
      type: Number,
      default: 0,
    },
    showHistory: {
      type: Boolean,
      default: false,
    },
    assessMode: {
      type: Number,
      default: 2,
    },
  },
  data() {
    return {
      extraData: {
        id: '',
        title: '',
        entryCont: '',
        audioList: [],
      },
      reviewsaData: {
        id: '',
        title: '',
        entryCont: '',
        audioList: [],
      },
      resultList: [
        { id: '1', name: '好' },
        { id: '2', name: '较好' },
        { id: '3', name: '一般' },
        { id: '4', name: '较差' },
      ],
      activeId: '',
      totalScore: '',
      scoringRadio: '',
      otherShow: false,
      scoreData: {},
      userInfoData: {},
      remark: '',
      userList: [],
      historyShow: false,
      tableData: {},
      criteriaShow: false,
      targetData: {}, // 评分标准及指标详情
      emptyTarget: [], // 空白指标评分
    }
  },
  computed: {
    ...mapGetters(['activeEvaluation']),
  },
  watch: {
    scoreListDetail: {
      handler(news, old) {
        this.scoreData = news
        this.activeId = this.scoreData.assessRank || this.scoreData.mainLeaderAssessRank || ''
        this.remark = this.scoreData.remark
        console.log('news :>> ', news)
        if (news.scoreIndexList && news.scoreIndexList.length) {
          this.targetData.children = JSON.parse(JSON.stringify(news.scoreIndexList))
        } else {
          this.targetData.children = JSON.parse(JSON.stringify(this.emptyTarget))
        }
      },
      deep: true,
    },
    userInfo: {
      handler(news) {
        this.userInfoData = news
        this.totalScore = news.totalScore || news.mainLeaderAssessScore || ''
        this.extraData = news.extraData
        this.reviewsaData = news.reviewsaData
        if (
          this.userInfoData.isSetLeaderAssess === 1 &&
          this.userInfoData.status != '2' &&
          this.userInfoData.leaderAssessRank
        ) {
          if (!this.userInfoData.assessRank) {
            this.activeId = this.userInfoData.leaderAssessRank
          } else {
            this.activeId = this.userInfoData.assessRank
          }
        }
      },
      deep: true,
      immediate: true,
    },
    extraData: {
      handler(news) {
        this.userInfoData.extraData = news
      },
      deep: true,
    },
    reviewsaData: {
      handler(news) {
        this.userInfoData.reviewsaData = news
      },
      deep: true,
    },
    remark: {
      handler(news) {
        this.userInfoData.remark = news
      },
      deep: true,
    },
    activeId: {
      handler(news) {
        this.$nextTick(() => {
          this.assessFilter(news)
        })
      },
      deep: true,
      immediate: true,
    },
    activeEvaluation: {
      handler(news) {
        this.userList = news
      },
      deep: true,
      immediate: true,
    },
  },
  created() {
    this.getAssessTarget()
  },
  mounted() {},
  methods: {
    chooseAssessSugg(item) {
      if (this.disabled) return
      if (this.busSign.includes('DEAL_MAIN_LEADER_ASSESS') && !this.userInfoData.leaderAssessRank) {
        if (this.busSign === 'DEAL_MAIN_LEADER_ASSESS_11') {
          return this.$toast.fail('分管负责人未评分')
        } else if (this.busSign === 'DEAL_MAIN_LEADER_ASSESS_10') {
          return this.$toast.fail('部门负责人未评分')
        } else {
          return this.$toast.fail('分管领导未评分')
        }
      }
      if (item.id === '1' && this.chooseGoodNum >= this.goodNum) {
        const str = `本次拟评价“好”等次${this.goodNum}人，现已${this.goodNum}人，如需评定为“好”，请更改其他评价`
        return this.$toast.fail(str)
      }
      if (item.id == 3) {
        this.$dialog
          .alert({
            title: '提示',
            message: '等次为“一般”，需要填写说明',
          })
          .then(() => {
            // on close
          })
      }
      if (item.id == 4) {
        this.$dialog
          .alert({
            title: '提示',
            message: '等次为“较差”，需要填写备注说明',
          })
          .then(() => {
            // on close
          })
      }
      this.activeId = item.id
      this.userInfoData.assessRank = item.id
      this.userInfoData.mainLeaderAssessRank = item.id
    },
    checkOther() {
      this.otherShow = true
    },
    assessFilter(news) {
      if (news == 1) {
        this.totalScore = 100
      } else if (news == 2) {
        this.totalScore = 80
      } else if (news == 3) {
        this.totalScore = 60
      } else if (news == 4) {
        this.totalScore = 0
      }
      this.userInfoData.totalScore = this.totalScore
      this.userInfoData.mainLeaderAssessScore = this.totalScore
    },
    checkHistory() {
      getUserHistoryAssessData({
        needId: this.$route.query.needId,
        userId: this.userInfoData.userId,
      }).then(res => {
        const data = {
          ...res.data[0].userAssessDataResponseVOS[0],
          showMode: res.data[0].showMode,
        }
        this.tableData = data
        this.historyShow = true
      })
    },
    checkStand() {
      this.criteriaShow = true
    },
    reviewData() {
      if (this.assessMode === 1) {
        this.indexScoreSubmit()
        return
      }
      this.$emit('renew-data', this.userInfoData)
    },
    closeCriteria() {
      this.criteriaShow = false
    },
    getAssessTarget() {
      getAssessTarget({
        id: this.$route.query.needId,
      }).then(res => {
        let data = res.data
        this.emptyTarget = JSON.parse(JSON.stringify(data.children))
        this.scoreData = this.scoreListDetail
        this.activeId = this.scoreData.assessRank || this.scoreData.mainLeaderAssessRank || ''
        this.remark = this.scoreData.remark
        if (this.scoreListDetail.scoreIndexList && this.scoreListDetail.scoreIndexList.length) {
          data.children = this.scoreListDetail.scoreIndexList
        }
        // console.log('this.scoreListData :>> ', this.scoreListDetail)
        this.targetData = data
      })
    },
    indexScoreSubmit() {
      this.$refs.indexScore.getData()
    },
    scoreSubmit(list) {
      if (this.disabled) return
      const flag = this.judgeAllA(list)
      if (flag && this.userInfoData.assessRank !== '1' && this.chooseGoodNum >= this.goodNum) {
        const str = `本次拟评价全优等次${this.goodNum}人，现已${this.goodNum}人，如需评定为全优，请更改其他评价`
        return this.$toast.fail(str)
      }
      const param = {
        saveStatus: '1',
        scoreIndexRequestList: list.children,
        scoringSuggestVO: {
          suggestion: this.reviewsaData.entryCont,
          voiceList: this.reviewsaData.audioList,
        },
        scoringExpressionVO: {
          expression: this.extraData.entryCont,
          voiceList: this.extraData.audioList,
        },
        scoringId: this.userInfoData.saScoringId,
        needId: this.$route.query.needId,
        flag,
      }
      this.$emit('renew-data', param)
    },
    judgeAllA(data) {
      let flag = true
      if (data.children && data.children.length) {
        for (let i = 0; i < data.children.length; i++) {
          const el = data.children[i]
          if (el.children && el.children.length) {
            flag = this.judgeAllA(el)
            if (!flag) break
          } else {
            if (el.checkOptionId !== el.optionList[0].optionId) {
              flag = false
              break
            }
          }
        }
      }
      return flag
    },
  },
}
</script>

<style lang="scss" scoped>
.score_type {
  font-size: 14px;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 10px 0 0;
  .score_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 12px 6px;
    .right-box {
      display: flex;
      align-items: center;
      .right {
        color: #0f61d5;
        margin-left: 5px;
      }
    }
  }
  .score_extra {
    margin-top: 15px;
    .extra_content {
      margin-top: 10px;
      .entry_sound {
        box-shadow: none;
        border: 1px solid #ccc;
      }
    }
  }
  .assess_sugg {
    margin-top: 15px;
    .sugg_choose {
      display: flex;
      align-items: center;
      justify-content: space-around;
      margin-top: 10px;
      flex: 1;
      .li {
        width: 70px;
        height: 27px;
        background: #f5f5f5;
        border-radius: 3px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #999999;
      }
      .active_li {
        background: #0f61d5;
        color: #ffffff;
      }
    }
    .instruction {
      display: flex;
      align-items: stretch;
      margin: 6px;
      margin-top: 15px;
      .name {
        margin-right: 12px;
        width: 60px;
        min-width: 60px;
        display: flex;
        justify-content: center;
        padding-top: 5px;
        align-items: flex-start;
      }
      .content {
        flex: 1;
        border: 1px solid #cccccc;
        padding: 0 5px;
        border-radius: 5px;
      }
    }
  }
  .leader_reviews {
    margin-top: 15px;
    .reviews-tips {
      color: #999999;
    }
    .reviews_content {
      margin-top: 10px;
      .entry_sound {
        box-shadow: none;
        border: 1px solid #ccc;
      }
    }
  }
  .scroll_box {
    flex: 1;
    overflow-y: auto;
    height: 0;
    padding: 0 12px 14px;
  }
  .score_table {
    padding: 0 16px 6px;
  }
  /deep/.van-dialog__content {
    padding: 8px 0;
  }
}
/deep/.history-dialog {
  .van-dialog__header {
    color: #1989fa;
    font-weight: bold;
  }
}
</style>
